
import { ResultPage } from 'antd-mobile'
import React, { useEffect, useState } from 'react'
import { LoopOutline } from 'antd-mobile-icons'
import { getDataApi } from '../../api/request'
import { ProductCard, Tag, Button } from 'react-vant';
function index() {
    const [list, setList] = useState([])
    const getdata = () => {
        getDataApi().then(res => {
            console.log(res)
            setList(res.data.data)
        })
    }
    useEffect(() => {
        getdata()
    }, [])
    return (
        <div><ResultPage
            status=''
            title='车票系统'
            description='12306'
        >
            <ResultPage.Card style={{ height: 200, padding: 8 }}>
                <div style={{ display: 'flex', justifyContent: 'space-between' }}>
                    <span>北京</span>
                    <span><LoopOutline /> </span>
                    <span>上海</span>
                </div>
                <div>
                    {
                        list?.map((v, i) => {
                            return <ProductCard
                            key={i}
                                num={v.id}
                                price="2.00"
                                desc={v.title}
                                title={v.from}
                                thumb="https://img.yzcdn.cn/vant/ipad.jpeg"
                            />
                        })
                    }
                </div>

            </ResultPage.Card>
        </ResultPage></div>
    )
}

export default index